<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="Expires" content="0"/>
    <title>电力消耗</title>
    <link rel="stylesheet" href="../../../assets/libs/layui/css/layui.css"/>
    <link rel="stylesheet" href="../../../assets/module/admin.css?v=317"/>
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- 加载动画 -->
<div class="page-loading">
    <div class="ball-loader">
        <span></span><span></span><span></span><span></span>
    </div>
</div>
<!-- 正文开始 -->
<form class="layui-form" id="formAdvForm" lay-filter="formAdvForm">
    <div class="layui-fluid" style="padding-bottom: 75px;">
        <div class="layui-card">
            <div class="layui-card-header">电力消耗
            </div>
            <div class="layui-card-body">
                <div class="layui-form-item layui-row">
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">生产线:</label>
                        <div class="layui-input-block">
                            <select name="lineNum" lay-filter="changeLine">
                                <option value="1">大线</option>
                                <option value="2">中线</option>
                                <option value="3">小线</option>
                                <option value="4">辅助</option>
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">消耗类型:</label>
                        <div class="layui-input-block">
                            <select name="useType" disabled>
                                <option value="1">生产消耗</option>
                                <option value="2">辅助消耗</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">能源类型:</label>
                        <div class="layui-input-block">
                            <select name="powerType" disabled>
                                <option value="1">电力</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item layui-row">
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">上一次抄表时间:</label>
                        <div class="layui-input-block">
                            <input name="topTime" class="layui-input"
                                   lay-verType="tips" lay-verify="required" autocomplete="off" required id="test2"/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3" style="display: none">
                        <label class="layui-form-label">上一次读数:</label>
                        <div class="layui-input-block">
                            <input name="topValue" class="layui-input" type="number" disabled
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>

                </div>

                <div class="layui-form-item layui-row">
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">本次抄表时间:</label>
                        <div class="layui-input-block">
                            <input name="addTime" class="layui-input" disabled="true"
                                   lay-verType="tips" lay-verify="required" autocomplete="off" required id="test1"/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label layui-form-required">本次表读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label">抄表图片:</label>
                        <button type="button" class="layui-btn" id="annex" onclick="chooseFile()">
                            <i class="layui-icon">&#xe67c;</i>上传文件
                        </button>
                        <span id="annexName"></span>
                    </div>
                </div>
            </div>
            <div>
                <button type="reset" class="layui-btn layui-btn-primary">&emsp;重置&emsp;</button>
                <a class="layui-btn" lay-filter="submit" lay-submit>&emsp;提交&emsp;</a>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">记录日志</div>
            <div class="layui-card-body">
                <table id="formAdvTable" lay-filter="formAdvTable"></table>
            </div>
        </div>
    </div>
</form>
<script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="../../../assets/js/common.js?v=317"></script>
<script type="text/javascript" src="../../../assets/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../../../assets/js/js.cookie.min.js"></script>
<script type="text/javascript" src="../../../assets/js/sqjx.js"></script>
<script>
    var storeName;
    layui.use(['layer', 'form', 'table', 'laydate'], function () {
        getTopUseLog();
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#test1', //指定元素
            type: 'datetime',
            trigger: 'click'
        });
        //执行一个laydate实例
        laydate.render({
            elem: '#test2', //指定元素
            type: 'datetime',
            trigger: 'click'
        });
        // /* 渲染表格 */
        var insTb = table.render({
            elem: '#formAdvTable',
            url: '/report/useLog/queryUseLogList',
            page: true,
            method: 'post',
            request: {
                pageName: 'page',
                limitName: 'rows',
            },
            where: {
                powerType: '1'
            },
            cellMinWidth: 100,
            cols: [[
                {
                    field: 'lineNum', title: '生产线', align: 'center', width: 100, templet(row) {
                        return row.lineNum == 1 ? '大线' : row.lineNum == 2 ? '中线' : row.lineNum == 3 ? '小线' : '--';
                    }
                },
                {
                    field: 'useType', title: '消耗类型', align: 'center', width: 100, templet(row) {
                        return row.useType == 1 ? '生产消耗' : '辅助消耗'
                    }
                },
                {
                    field: 'powerType', title: '能源类型', align: 'center', width: 100, templet(row) {
                        return row.powerType == 1 ? '电力' : '燃气'
                    }
                },

                {field: 'addTime', title: '抄表时间', align: 'center'},
                {field: 'value', title: '抄表值', align: 'center', width: 100},
                {field: 'topTime', title: '上一次抄表时间', align: 'center'},
                {field: 'topValue', title: '上一次记录值', align: 'center', width: 100},
                {field: 'crtUserName', title: '记录人', align: 'center',},

                {
                    field: 'crtDate', title: '记录时间', align: 'center', templet(row) {
                        return dateFormatter(row.crtDate)
                    }
                },

                {
                    field: '操作', title: '操作', fixed: 'right', align: 'center', templet(row) {
                        if (row.storeName) {
                            return `<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" ">删除</a>
                                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="watch" ">查看截图</a>`
                        } else {
                            return `<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" ">删除</a>`

                        }
                    }
                },
            ]],
            parseData: function (res) {
                return {
                    "code": 0,
                    "msg": "",
                    "count": res.obj.total,
                    "data": res.obj.rows
                }
            }
        });
        /* 监听表单提交 */
        form.on('submit(submit)', function (data) {
            var param = data.field;
            param.crtUserAccount = getAccount();
            param.crtUserName = getUserName();
            param.storeName = storeName;
            if (param.useType == 1) {
                if (parseFloat(param.value) <= parseFloat(param.topValue)) {
                    showAlert('本次抄表读数不得小于等于上次抄表读数！！！');
                    return false;
                }
            }
            layer.confirm('确认提交？', function () {
                $.post('/report/useLog/addUseLog', param, function (res) {
                    if (res.code == 200) {
                        closeDialog();
                        insTb.reload();
                        getTopUseLog();
                        showAlert('日志已保存', 1);
                    } else {
                        showAlert(res.msg);
                    }
                });
            });
        });
        form.on('select(changeLine)', function (data) {
            if (data.value == 4) {
                $("[name='useType']").val(2)
            } else {
                $("[name='useType']").val(1)
            }
            form.render()
            getTopUseLog()
        })
        table.on('tool(formAdvTable)', function (obj) {
            if (obj.event == 'del') {
                layer.confirm('确认删除该条日志？', function () {
                    $.post('/report/useLog/deleteUseLog', {id: obj.data.id}, function (res) {
                        if (res.code == 200) {
                            closeDialog();
                            getTopUseLog();
                            showAlert('删除成功', 1);
                            insTb.reload({page: {curr: 1}});
                        } else {
                            showAlert('删除失败');
                        }
                    })
                })
            }
            if (obj.event == 'watch') {
                window.open(BASE_ANNEX + obj.data.storeName + "?token=" + Cookies.get("token"));
            }
        })

    });

    function getTopUseLog() {
        var param = {};
        param.lineNum = $("[name='lineNum']").val();
        param.powerType = $("[name='powerType']").val();
        param.useType = $("[name='useType']").val();

        $.post('/report/useLog/getTopUseLog', param, function (res) {
            var topUseLog = res.obj;
            if (topUseLog) {
                $("[name='topValue']").val('0');
                $("[name='topTime']").val(topUseLog.addTime);
                $("[name='addTime']").val(topUseLog.offsetTime);
            } else {
                $("[name='topValue']").val('0');
                $("[name='topTime']").val('');
            }
            closeDialog()
        })
    }


    function chooseFile() {
        var input = document.createElement("input");
        input.type = "file";
        input.click(); //代码执行到这里，本地文件选择框便会打开！
        input.onchange = function () {
            cbAnnexFile = input.files[0];
            if (cbAnnexFile.name.indexOf('jpeg') == -1 &&
                cbAnnexFile.name.indexOf('png') == -1 &&
                cbAnnexFile.name.indexOf('jpg') == -1) {
                showAlert('请上传:jpeg,jpg,png格式的附件');
                return false;
            }
            $("#annexName").text(cbAnnexFile.name);

            layer.confirm('是否确定上传' + cbAnnexFile.name + '?', function (i) {
                var formData = new FormData();
                formData.append("file", cbAnnexFile);
                var result = uploadFile(formData);
                if (result.code == 200) {
                    storeName = result.obj.storeName;
                    showMsg('上传成功');
                    layer.close(i);
                }
            })
        };
    }


</script>
</body>
</html>
